<template>
	<view id="login">
		<view class="title">
			移动经纪人
		</view>
		<view class="form">
			<input ref="user" @input="changeUser" :value="user" class="uni-input" name="input" placeholder="请输入账号" />
			<input ref="pass" @input="changePass" :value="pass" type="password" class="uni-input" name="input" placeholder="请输入密码" />
		</view>
		<view class="submit">
			<button type="submit" class="login" @click="loginIn">登录</button>
		</view>
		<view class="agreement">
			登录即代表同意<a href="" class="agree">用户服务协议</a>
		</view>
		<view class="bottom_line">
			
		</view>
		<mpopup  ref="mpopup" :isdistance="true"></mpopup>  
	</view>
</template>

<script>
	var _self;
	import mpopup from '../../components/xuan-popup/xuan-popup.vue';
	
	export default {
		components:{
			mpopup
		},
		
		data() {
			return {
				title: 'login',
				user:'',
				pass:''
			}
		},
		onLoad(){

			
		},
		methods: {
			loginIn(){
				_self = this;
				//var user = this.;
				//var pass = this.$refs.pass.inputValue;				
				uni.request({
				    url: 'http://api.yjzufang.com/api.php/Login/login',
					method: 'POST',//仅为示例，并非真实接口地址。
				    header: {
				    	'content-type':'application/x-www-form-urlencoded'				    	
				    },
					data: {
				        mobile: this.user,
				        password: this.pass
				    },
				    success: function (res) {
				        
						if(res.data.code == 1){
							_self.$refs.mpopup.open({
								type:'success',
								content:res.data.msg,
								timeout:2000,
							});
							uni.setStorageSync('token',res.data.data.token);							
							uni.switchTab({
							    url: '/pages/me/me'
							});							
						}else{
							_self.$refs.mpopup.open({
								type:'info',
								content:res.data.msg,
								timeout:2000,
							});
							
						}
				    }
				});
			},			
			changeUser(e){
				this.user = e.detail.value		
			},
			changePass(e){
				this.pass = e.detail.value
			}
		}		
	}
</script>

<style>
	#login{
		overflow: hidden;
		width: 100%;
		height: 100%;
		background: #F8F8FA;
	}
	.title{
		margin-top: 300upx;
		font-size: 48upx;
		text-align: center;
	}
	.form{
		margin: 55upx auto 0;
		width: 95%;
	}
	.form input{

		height: 110upx;
		padding:0 10upx;
		margin: 30upx 0;
		background: white;
		color:#373737;
		text-align: center;
		border-radius: 55upx;
	}
	.submit{
		margin: 30upx auto 0;
	}
	.login{
		width: 300upx;
		height: 110upx;
		margin: 60upx auto 0;
		color: white;
		font-size: 36upx;
		text-align: center;
		line-height: 110upx;
		background: #FF984C;
		border-radius: 55upx;
	}
	.agreement{
		margin-top: 300upx;
		color: #8F8F8F;
		font-size: 24upx;
		text-align: center;
	}
	.agreement a{
		color:black;
		font-weight: bold;
	}
</style>
